padOsd: shuffle title labels hierarchy

Add some boxes in between, so we can add the pad chooser button
and the overall result is still centered.

https://bugzilla.gnome.org/show_bug.cgi?id=779986

diff --git a/data/theme/gnome-shell-high-contrast.css b/data/theme/gnome-shell-high-contrast.css
index b46a695c83990a12ffe8631b7d3eafb9ed5c6b8b..fdb0d271e02d10e9a7def2844888d58f5195081c 100644 (file)
--- a/data/theme/gnome-shell-high-contrast.css
+++ b/data/theme/gnome-shell-high-contrast.css
@@ -566,6 +566,10 @@ StScrollBar {
 .pad-osd-window {
   padding: 32px;
   background-color: rgba(0, 0, 0, 0.8); }
+  .pad-osd-window .pad-osd-title-box {
+    spacing: 12px; }
+  .pad-osd-window .pad-osd-title-menu-box {
+    spacing: 6px; }
 
 .combo-box-label {
   width: 15em; }

diff --git a/data/theme/gnome-shell-sass b/data/theme/gnome-shell-sass
index 671023a8b333f027d8c88fca9963b11581c10a70..c2e4db4980c4f99a237d20186dcd7f265a83cb6b 160000 (submodule)
--- a/data/theme/gnome-shell-sass
+++ b/data/theme/gnome-shell-sass
@@ -1 +1 @@
-Subproject commit 671023a8b333f027d8c88fca9963b11581c10a70
+Subproject commit c2e4db4980c4f99a237d20186dcd7f265a83cb6b

diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 5f2d39ff47acac6fdf187d73949def3da39c52d7..ed8aa5eee5bffc8bfff8e221c48ad361cf653604 100644 (file)
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -566,6 +566,10 @@ StScrollBar {
 .pad-osd-window {
   padding: 32px;
   background-color: rgba(0, 0, 0, 0.8); }
+  .pad-osd-window .pad-osd-title-box {
+    spacing: 12px; }
+  .pad-osd-window .pad-osd-title-menu-box {
+    spacing: 6px; }
 
 .combo-box-label {
   width: 15em; }

diff --git a/js/ui/padOsd.js b/js/ui/padOsd.js
index e172a6e4fd0aa92550e4e3c4fed8cd5ad83e085f..e3ca88179a28d3f03c3451bac1503b7ee8e762a1 100644 (file)
--- a/js/ui/padOsd.js
+++ b/js/ui/padOsd.js
@@ -560,13 +560,23 @@ const PadOsd = new Lang.Class({
         let constraint = new Layout.MonitorConstraint({ index: monitorIndex });
         this.actor.add_constraint(constraint);
 
+        this._titleBox = new St.BoxLayout({ style_class: 'pad-osd-title-box',
+                                            vertical: false,
+                                            x_expand: false,
+                                            x_align: Clutter.ActorAlign.CENTER });
+        this.actor.add_actor(this._titleBox);
+
+        let labelBox = new St.BoxLayout({ style_class: 'pad-osd-title-menu-box',
+                                          vertical: true });
+        this._titleBox.add_actor(labelBox);
+
         this._titleLabel = new St.Label({ style: 'font-side: larger; font-weight: bold;',
                                           x_align: Clutter.ActorAlign.CENTER });
         this._titleLabel.clutter_text.set_text(padDevice.get_device_name());
-        this.actor.add_actor(this._titleLabel);
+        labelBox.add_actor(this._titleLabel);
 
         this._tipLabel = new St.Label({ x_align: Clutter.ActorAlign.CENTER });
-        this.actor.add_actor(this._tipLabel);
+        labelBox.add_actor(this._tipLabel);
 
         this._actionEditor = new ActionEditor();
         this._actionEditor.connect('done', Lang.bind(this, this._endButtonActionEdition));